<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2020/10/16
  Time: 10:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>考题</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script src="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.js"></script>
    <meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />

    <script>
        function subTopic() {
            //获取表单内容
            var subject=$("[name=subject]").val()
            var a=$("[name=a]").val()
            var b=$("[name=b]").val()
            var c=$("[name=c]").val()
            var d=$("[name=d]").val()
            var answer=$("[name=answer]").val()
            var paperId=$("#paperId").val()

            if(subject == null && subject == ""){
                alert("题目不能为空")
                return false
            }
            if(a == ""){
                alert("请设置选项！！")
                return false
            }



            $.ajax({
                //请求路径
                url:"/paper/addTopic",
                //请求参数
                data:{
                    subject:subject,
                    a:a,
                    b:b,
                    c:c,
                    d:d,
                    answer:answer,
                    paperId:paperId
                },
                type:"post",
                dateType:"json",
                success:function (data) {
                    alert(data.msg)
                    window.location.href="/paper/getTopic?paperId=${paperId}&pName=${pName}"

                },error:function () {
                    alert("系统异常，请稍后重试")
                }

            })

        }
    </script>

</head>
<body>
<jsp:include page="hade.jsp"/>
<div class="container">
    <h2>${pName}</h2>
    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">设置新考题</button>
    <form action="/paper/getTopic" method="post">
        <div class="row">
            <div class="col-lg-3">
                <input type="text" class="form-control" name="name" id="selname" style="width:270px" placeholder="请输入要查询的考题">
            </div>
            <div class="col-lg-2">
                <button type="submit" class="btn btn-primary">查询</button>
            </div>
        </div>
    </form>
    <table class="table table-hover">
        <thead>
        <tr>
            <th>题号</th>
            <th>题目</th>
            <th>选项A</th>
            <th>选项B</th>
            <th>选项C</th>
            <th>选项D</th>
            <th>答案</th>
            <th>状态</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${list}" var="topic">
            <tr>
                <td>${topic.titleNumber}</td>
                <td>${topic.subject}</td>
                <td>${topic.a}</td>
                <td>${topic.b}</td>
                <td>${topic.c}</td>
                <td>${topic.d}</td>
                <td>${topic.answer}</td>
                <td>
                    <span class="badge badge-success">${topic.deleteFlag eq 0?"正常":""}</span>
                    <span class="badge badge-danger">${topic.deleteFlag eq 1?"已删":""}</span>
                </td>
                <td>
                     <a href="/paper/toupdateTopic?paperId=${paperId}&titleNumber=${topic.titleNumber}"><button type="button" class="btn btn-danger">编辑</button></a>
                    <a href="/paper/deleteTopic/${topic.paperId}/${topic.titleNumber}"><button type="button" class="btn btn-danger">删除</button></a>
                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
</div>
<br>
<!-- 添加模态框 -->
<div class="modal fade" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">

            <!-- 模态框头部 -->
            <div class="modal-header">
                <h4 class="modal-title">设置新的考题</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <%--<form action="${pageContext.request.contextPath}/account/addAccount" method="post">--%>
            <!-- 模态框主体 -->
            <div class="modal-body">

                <input type="hidden" value="${paperId}" id="paperId">

                <div class="form-group">
                    <label for="subject">考题:</label>
                    <input type="text" class="form-control" id="subject" name="subject" placeholder="请输入新的考题">
                </div>
                <div class="form-group">
                    <label for="a">选项A:</label>
                    <input type="text" class="form-control" id="a" name="a" placeholder="请输入选项A答案">
                </div>
                <div class="form-group">
                    <label for="b">选项B:</label>
                    <input type="text" class="form-control" id="b" name="b" placeholder="请输入选项B答案">
                </div>
                <div class="form-group">
                    <label for="c">选项C:</label>
                    <input type="text" class="form-control" id="c" name="c" placeholder="请输入选项C答案">
                </div>
                <div class="form-group">
                    <label for="d">选项D:</label>
                    <input type="text" class="form-control" id="d" name="d" placeholder="请输入选项D答案">
                </div>
                <div class="form-group">
                    <label for="answer">答案:</label>
                    <select class="form-control" id="answer" name="answer">
                        <option value="-1" selected>请选择正确答案</option>
                        <option value="A">A</option>
                        <option value="B">B</option>
                        <option value="C">C</option>
                        <option value="D">D</option>
                    </select>
                </div>
            </div>
            <!-- 模态框底部 -->
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="subTopic()">保存</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>


</body>
</html>
